 <style type="text/css">
  

      /* Custom container */
     /* .container {
        margin: 0 auto;
      }
      .container > hr {
        margin: 60px 0;
      }
*/
 
  .ui-match {
    background-color: #DEF84B;
  }

    </style>

    <!-- Main Content Section -->
         


    <div style="max-width: 1200px; margin: 0 auto; padding-top: 45px"
          ng-controller="BlogReadItem" >

      <input placeholder="Highlight Words" 
      value="by" ng-model="highlightText"
      class="align-right">


      <!-- RECENT POST -->
      <div class="row-fluid" ng-controller="MyCtrl" ng-show="showRecentPostsPanel">

        <div class="masthead">
        <button class="btn btn-primary" style="margin-top: 20px"
        ng-click="isCollapsed = !isCollapsed">Show/Hide Recent Activities</button>
        </div>

        <!-- Jumbotron -->
        <div class="jumbotron"    collapse="isCollapsed">
         <div ng-grid="gridOptions" class="gridStyle" style="height: 200px"></div> 
        </div>
      </div>

      <hr>

      <div class="row-fluid cmsMainPost">

        <div>
            <div class="row-fluid">
              <h3 class="span6 titleSpecial"
              ng-bind-html-unsafe="'by ' + threadInfo.thread.author | highlight:highlightText:caseSensitive">'by' </h3>
              <h5 class="span6 text-right">{{threadInfo.thread.date}}</h5>
            </div>

            <!-- Jumbotron -->
            <div class="jumbotron">
              <h1 ng-bind-html-unsafe="threadInfo.thread.title | highlight:highlightText:caseSensitive"></h1>              
              <p ng-bind-html-unsafe="threadInfo.thread.msg | highlight:highlightText:caseSensitive"></p>
              
            </div>


            <!-- ATTACHMENTS -->
            <a ng-href="{{f.link}}" target="_blank" 
               class="titleSpecial noURLBorder"
               ng-repeat="f in threadInfo.thread.attachments" >
            <img ng-src="{{f.tmb}}"                    
                 class="cmsIcon"
                 tooltipltip-placement="bottom" 
                 tooltip="{{f.label}}">
            </a>


        </div>

      </div>

      <hr>

      <!-- COMMENTI -->
      <div ng-repeat="c in comments">
        <div class="row-fluid cmsComment">
          <div class="content">

            <div class="row-fluid">

              <!-- ATTACHMENTS -->
              <span class="span6 titleSpecial" 
                style="font-size:2em; ">
                # {{c.index}} / 
                <span ng-bind-html-unsafe="c.author | highlight:highlightText:caseSensitive"></span>
               
              </span>


              <h5 class="span6 text-right">{{c.date}}</h5> 
             


              <!-- <h1 class="span6 titleSpecial">
                <img src="images/icon/black_with_circle/Align-justify.png" 
                     class="cmsIcon"
                     tooltip-placement="left" 
                     tooltip="There is some code on this comment"># {{c.index}}</h1>
              <h6 class="span6 text-right">{{c.date}}</h6> -->
            </div>



              <!-- Jumbotron -->
             <p ng-bind-html-unsafe="c.msg | highlight:highlightText:caseSensitive"></p>

              
            <a ng-href="{{a.link}}" target="_blank" 
                   class="noURLBorder"
                   ng-repeat="a in c.attachments" >
            <img ng-src="{{a.tmb}}"                    
                 class="cmsIcon"
                 tooltipltip-placement="bottom" 
                 tooltip="{{a.label}}">
            </a>
                


            <!-- <textarea ui-tinymce ng-model="c.code" rows="12"
           theme="simple"></textarea> -->
           <!-- 
             <div ace="javascript" ng-model="bitchisn">
  <textarea >{{c.code}}</textarea>
            </div>
 -->

        </div>

            <div ui-if="c.code != null">
             <textarea 
                  ui-codemirror="{
                    lineWrapping : true,
                    lineNumbers: true,
                    onChange: reParseInput,
                    readOnly: true,
                    mode: 'javascript',
                    theme: 'ambiance'
                    }"            
                  ng-model="c.code"
                ></textarea>
            </div>
      </div>

       <hr>

<!-- 
      <div ng-controller="CommentsCtrl">
        <div class="row-fluid cmsComment">
          <div class="content">
             <h3><img src="images/icon/black_with_circle/Align-justify.png" class="cmsIcon"
              tooltip-placement="left" tooltip="There is some code on this comment">Commento #2</h3>

             <p>111Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
             
        </div>
      </div>
 -->


      </div><!--  FINE COMMENTI -->




       <div class="row-fluid">
            <h1 class="titleSpecial">  Add your answer...</h1>

          <!-- Jumbotron -->
          <div class="jumbotron"    collapse="isCollapsed">

           <textarea ui-tinymce ng-model="tinymce" style="width:700px" rows="20" ></textarea>
          <!-- <p>{{tinymce}}</p> -->

          </div>

         

      </div>


      <hr>


          <!-- ADD CODE -->
          <div class="row-fluid" ng-controller="addCommentCtrl">

          <hr>
            <span  ng-click="isCodePanelHidden = !isCodePanelHidden"
 style="cursor:pointer"
               
               >
              <img src="images/icon/black_with_circle/Align-center.png"
               class="cmsIcon"
               tooltip-placement="right" 
               tooltip="Expand / Collapse panel"
             > 
              <span class="titleSpecial">  Add your < code > </span>
            </span>
      
            <!-- CODE MIRROR -->
            <div  collapse="isCodePanelHidden">
              <textarea
                ui-codemirror="{
                  lineWrapping : true,
                  lineNumbers: true,
                  onChange: reParseInput,
                  readOnly: false,
                  theme: 'ambiance' 
                  }"            
                ng-model="threadInfo.thread.code"
              ></textarea>

              <button ng-click="clearCode()" class="btn">Clear Code</button>

              <button class="btn">FullScreen View (todo)</button>
            

          </div>


      </div>

      <hr>

      

      <!-- BOX NOTIFY TO -->
      <div class="row-fluid" ng-controller="NotifyToCtrl">
       

        <span class="span3">
           <img src="images/icon/black_with_circle/Check boxes.png" class="cmsIcon"
           tooltip-placement="right"
           tooltip="Select the user that will receive a notification by mail">
           <span class="titleSpecial">  Notify to:</span>
         </span>

        <span class="span9">
          <span ng-repeat="u in usersToNotify" >

              <input type="checkbox" 
                     ng-checked="{{u.notified}}"
                     id="checkbox-1-{{u.id}}" 
                     class="regular-checkbox" />
              <label for="checkbox-1-{{u.id}}">{{u.displayedName}} </label>

           <!--  <label ng-show="u.owner==false">
              <input type="checkbox" name="checkbox" value="{{u.id}}" 
              class="regular-checkbox" 
              />{{u.displayedName}} - {{u.owner}}
            </label> -->
          </span>
        </span>
      </div>


      <hr>



       <!-- ATTACH FILES -->
      <div ng-include src="'partials/components/attachFiles.html'"></div>
       <hr>





     
      <div class="row-fluid text-right">
        <a class="btn btn-large btn" href="#">Export to Live Presentation </a>
        <a class="btn btn-large btn" href="#">Export thread to PDF</a>
        <a class="btn btn-large btn-success" href="#">Send and Notify all</a>
      </div>


      <!-- Example row of columns -->
     <!--  <div class="row-fluid">
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
        </div>
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
       </div>
        <div class="span4">
          <h2>Heading</h2>
          <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.</p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
        </div>
      </div>
-->
      <hr> 

      

      <div id="footer">
        <div>
          <p class="muted credit" style="">Angular PM - <a href="http://www.fabiobiondi.com">Fabio Biondi</a> and <a href="http://www.wasabit.it/">Thomas Dolso</a>.</p>
        </div>
      </div>

    </div> <!-- /container -->



